/**
* 作者 ：食草狂魔
*
* 日期 ：2017/9/20
*
* 描述 ：公共头部组件
*/
<template>
  <el-header style="height: 100px;">
    <el-row>
      <el-col :span="4" class="logo">
        <router-link :to="{ path: '/' }">
          <img src="./logo.png">
        </router-link>
      </el-col>
      <el-col :span="16">
        <el-row class="menu">
          <el-col :span="2">
            <router-link :to="{ path: '/' }" :class="{ act: menuState==='home' }">
              首页
            </router-link>
          </el-col>
          <el-col :span="3" v-for="item in menus">
            <router-link :to="{ path: item.frontUrl }" :class="{ act: menuState==item.frontUrl }">
              {{ item.name }}
            </router-link>
          </el-col>
          <!--<el-col :span="3">-->
          <!--<router-link :to="{ path: '/templateManage/main' }" :class="{ act: menuState==='templateManage' }">-->
            <!--模板管理-->
          <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="3">-->
            <!--<router-link :to="{ path: '/catalogManage/main' }" :class="{ act: menuState==='catalogManage' }">-->
              <!--目录管理-->
            <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="3">-->
            <!--<router-link :to="{ path: '/catalogAuditing/main' }" :class="{ act: menuState==='catalogAuditing' }">-->
              <!--目录审核-->
            <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="3">-->
            <!--<router-link :to="{ path: '/systemManage/main' }" :class="{ act: menuState==='systemManage' }">-->
              <!--系统管理-->
            <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="3">-->
            <!--<router-link :to="{ path: '/statistical/main' }" :class="{ act: menuState==='statistical' }">-->
              <!--统计分析-->
            <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="2">-->
            <!--<router-link :to="{ path: '/search/main' }" :class="{ act: menuState==='search' }">-->
              <!--搜索-->
            <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="3">-->
            <!--<router-link :to="{ path: '/helpcenter/main' }" :class="{ act: menuState==='helpcenter' }">-->
              <!--帮助中心-->
            <!--</router-link>-->
          <!--</el-col>-->
          <!--<el-col :span="2">-->
            <!--<router-link :to="{ path: '/systemLog/main' }" :class="{ act: menuState==='systemLog' }">-->
              <!--日志-->
            <!--</router-link>-->
          <!--</el-col>-->
        </el-row>
      </el-col>
      <el-col class="adminInfo" :span="3">
        <p>hi,<span class="userName">{{userName}}</span> | <a href="javascript:void(0);" class="logout" @click="logout">退出</a></p>
      </el-col>
    </el-row>
  </el-header>
</template>
<script>
  import authAPIs from '../../api/authAPIs'
  export default {
    name: 'Header',
    props: ['menuState'],
    data () {
      return {
        userName: localStorage.userName?localStorage.userName:"未知用户",
        menus: JSON.parse(localStorage.menus).filter(item => {
          return item.parentId == "0"
        })
      }
    },
    mounted:function () {
//      let vm = this
//      let menus = JSON.parse(localStorage.menus)
//      vm.menus = menus.filter(item => {
//        console.log(item)
//        return item.parentId == "0"
//      })
//      console.log(vm.menus)
    },
    methods: {
      logout () {
        let vm = this
//        alert("tuichu")
        authAPIs.logout({
          token: localStorage.token?localStorage.token:""
        }).then(({ data }) => {
          if(data.code == 10000) {
            // 退出成功
            localStorage.removeItem("token")
            localStorage.removeItem("userName")
            localStorage.removeItem("roleName")
            localStorage.removeItem("menus")
            vm.$router.push({ path: "/login" })
          }
          else if(data.code == 10008) {
            // 会话结束
            localStorage.removeItem("token")
            localStorage.removeItem("userName")
            localStorage.removeItem("roleName")
            localStorage.removeItem("menus")
            vm.$router.push({ path: "/login" })
          }
          else{
            this.$message.error('退出失败 !');
          }
        })
      }
    }
  }
</script>

<style>
  @import "./header.styl";
</style>
